function drawClear ( canvasName )
{
  var canvas = document.getElementById( canvasName );
  if ( canvas && canvas.getContext )
  {
    var ctx = canvas.getContext( '2d' );
    ctx.clearRect( 0, 0, 15, 15 );
  }
}

function drawUp ( canvasName, isOn ) 
{
  var bgcolor, fgcolor; 

  var canvas = document.getElementById( canvasName );
  if ( canvas && canvas.getContext )
  {
    var ctx = canvas.getContext( '2d' );

    if ( isOn ) {
      bgcolor = button_medColor;
      fgcolor = button_highColor;
    } else {
      bgcolor = button_lowColor;
      fgcolor = button_medColor;
    }

    ctx.fillStyle = bgcolor;
    ctx.fillRect( 0, 0, 15, 15 );

    ctx.fillStyle = fgcolor;

    ctx.beginPath();
    ctx.moveTo( 4, 9 );
    ctx.lineTo( 8, 5 );
    ctx.lineTo( 11.75, 9 );
    ctx.fill();

    ctx.clearRect( 0, 0, 1, 1 );
    ctx.clearRect( 14, 0, 1, 1 );
    ctx.clearRect( 0, 14, 1, 1 );
    ctx.clearRect( 14, 14, 1, 1 );

    ctx.globalAlpha = .5;
    ctx.fillStyle = bgcolor;

    ctx.fillRect( 0, 0, 1, 1 );
    ctx.fillRect( 14, 0, 1, 1 );
    ctx.fillRect( 0, 14, 1, 1 );
    ctx.fillRect( 14, 14, 1, 1 );

    ctx.globalAlpha = 1;

  }
}

function drawDown ( canvasName, isOn ) 
{
  var bgcolor, fgcolor; 

  var canvas = document.getElementById( canvasName );
  if ( canvas && canvas.getContext )
  {
    var ctx = canvas.getContext( '2d' );

    if ( isOn ) {
      bgcolor = button_medColor;
      fgcolor = button_highColor;
    } else {
      bgcolor = button_lowColor;
      fgcolor = button_medColor;
    }

    ctx.fillStyle = bgcolor;
    ctx.fillRect( 0, 0, 15, 15 );

    ctx.fillStyle = fgcolor;

    ctx.beginPath();
    ctx.moveTo( 4, 6 );
    ctx.lineTo( 8, 10 );
    ctx.lineTo( 11.75, 6 );
    ctx.fill();

    ctx.clearRect( 0, 0, 1, 1 );
    ctx.clearRect( 14, 0, 1, 1 );
    ctx.clearRect( 0, 14, 1, 1 );
    ctx.clearRect( 14, 14, 1, 1 );

    ctx.globalAlpha = .5;
    ctx.fillStyle = bgcolor;

    ctx.fillRect( 0, 0, 1, 1 );
    ctx.fillRect( 14, 0, 1, 1 );
    ctx.fillRect( 0, 14, 1, 1 );
    ctx.fillRect( 14, 14, 1, 1 );

    ctx.globalAlpha = 1;

  }
}
